<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!--
本模块功能:文件查重
编写者:王天宇
编写时间:2020.03.18
-->
<!DOCTYPE html>
<html class="wrap">

<head>
	<meta charset="UTF-8">
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<title>文件查重</title>

	<link rel="stylesheet" type="text/css" href="pc/css/cores/jstree.css" /><!--样式-->
	<link rel="stylesheet" type="text/css" href="pc/css/cores/style.css" /><!--公共样式-->


	<link rel="stylesheet" type="text/css" href="pc/css/extends/list.css" /><!--翻页插件样式-->
	<link rel="stylesheet" type="text/css" href="pc/css/cores/alert.css" /><!--弹出盒样式-->
	<link rel="stylesheet" type="text/css" href="pc/css/cores/public.css" /><!--公共样式-->

	<link rel="stylesheet" type="text/css" href="pc/css/modules/teacherClassManagement.css?f=<%=System.currentTimeMillis()%>" />
	<style>
		.file-box{
			position: relative;
			overflow: hidden;
		}
		.file-box #myTFCfile{
			position: absolute;
			width: 100%;
			height: 100%;
			left: 0;
			top: 0;
			opacity: 0;
			cursor: pointer;
		}
		.tfc-nodata{
			text-align: center;
			padding:150px 0;
		}
		.tfc-nodata img{
			display: inline-block;
			text-align: center;
		}
		.alert_btn{
			display: none;
		}
		.alert_content{
			height: auto;
		}
		#jstree .jstree-icon{
			background-image: url(pc/images/nes.png);
		}
		.jstree-default .jstree-themeicon{
			background-position: -226px -4px;
		}
		#jstree{
			padding-top: 20px;
			padding-left: 10px;
		}
		.mask{
			background: rgba(0,0,0,.5);
			width: 100%;
			height: 100%;
			z-index: 99;
			position: absolute;
			top: 0;
			left: 0;
			display: none;

		}

		.boxs{
			background: #fff;
			width: 100%;
			padding-bottom: 20px;
		}
		.nthead{
			background: #e6e6e6;
			color: #333;

			border-radius: 5px 5px 0 0;
			font-size: 16px;
			line-height: 40px;
			height: 40px;
			padding-left: 20px;
			position: relative;
		}
		.closes{
			line-height: 40px;
			width: 40px;
			display: block;
			text-align: center;
			cursor: pointer;

		}
		.closes img{
			display: inline-block;
		}
		.looking{
			cursor: pointer;
		}
	</style>

</head>

<body>
<div class="crumbs">
	<div class="fl returnBox"><!-- &ensp;<img src="pc/images/ico_return.png" alt="返回按钮" />&ensp;
				<a class="looktg" href="javascript:;" onClick="javascript:window.history.go(-1)">返回上一页</a>
			 --></div>
	<div class="fl noticeBox"><img src="pc/images/ico_trumpet.png" />
		<div class="noticeBar">
			<ul>
				<li>当前暂无消息</li>
			</ul>
		</div>
	</div>
</div>
<div class="clear"></div>


<div class="mainContent">
	<div class="funBox">

		<form class="bs-example bs-example-form from1" role="form" id="searchCriteria">

			<div class="publicBtn fl file-box" style="margin-right:20px;">上传文件
				<input type="file" id="myTFCfile" onchange="uploadTFCFile()" />
			</div>
			<div class="fl inputRight"><label for="departNames">重复率大于:&ensp;</label>
				<select id="selectTFCClass" class="publicSelect" />
					<option value="1" classid='""'>请选择</option>
					<option value="0.9">90%</option>
					<option value="0.8">80%</option>
					<option value="0.7">70%</option>
					<option value="0.6">60%</option>
					<option value="0.5">50%</option>
					<option value="0.4">40%</option>
					<option value="0.3">30%</option>
					<option value="0.2">20%</option>
					<option value="0.1">10%</option>
				</select>
			</div>
			<div class="fl publicBtn searchBtn" onclick="searchTFC()">查询</div>


		</form>






		<div class="clear"></div>





	</div>
	<div class="clear"></div>
	<div class="prompt">
		<!--提示-->
<%--		<span class="looking">查看</span>--%>
<%--		<span style="font-size: 14px;" class="fl">提示 :&ensp;</span>--%>
		<ul style="color: #b8b8b8;" class="fl">
<%--			<li>请上传zip或者rar文件，当前只对doc和docx类型的文件进行重复率对比。</li>--%>

			<%--<li>2.可以在‘查看虚拟机’功能中替换发生故障的机器，替换请注明替换事由，方便管理员判断。</li>--%>

		</ul>
	</div>

	<div class="clear"></div>
	<table id="tfcTable" class="tableBox box_1" border="0" cellspacing="0" cellpadding="0">
		<thead>

		<tr>
			<th class="col-lg-2">序号</th>
			<th class="col-lg-5">文件名</th>
			<th class="col-lg-11">对比文件</th>
			<th class="col-lg-4">相似度</th>
		</tr>
		</thead>
		<tbody>

		</tbody>
	</table>
	<div class="tfc-nodata">
		<img src="pc/images/wjcc.jpg" />
	</div>

	<div class="page">

		<div class="tcdPageCode"></div>

	</div>
	<div class="clear"></div>

    <div class="mask">
		<div class="alert" style="top: 0">
			<p class="nthead">文件查看<span class="fr closes"><img src="pc/images/ico_alertDel.png" alt="叉"></span></p>
			<div class="alert_box boxs">
				<div id="jstree"></div>
			</div>
		</div>
	</div>

</div>




<div class="clear"></div>



<script>
    var result = '${result}';
    result = JSON.parse(result);
</script>
<script src="pc/js/extends/jquery-1.11.2.min.js"></script>
<script src="pc/js/extends/bootstrap-datetimepicker.min.js"></script>
<script src="pc/js/extends/bootstrap-datetimepicker.zh-CN.js"></script>


<script src="pc/js/extends/jquery.page.js"></script><!--翻页插件-->

<script src="pc/js/cores/Alert.js"></script><!--弹出盒-->
<script src="pc/js/cores/public.js"></script><!--公共-->

<script src="pc/js/extends/trumbowyg.js"></script><!--编辑器插件-->
<script src="pc/js/extends/trumbowyg.base64.min.js"></script><!--编辑器插件-->
<script src="pc/js/cores/jstree.js"></script><!--编辑器插件-->
<%--<script src="pc/js/modules/teacherFileChecking.js?f=<%=System.currentTimeMillis()%>"></script>--%>
<script>

	var confirm1 = new Confirm;
	var Alert1 = new Alert;
	var Alert2 = new Alert;
	var jsonArray = [];
	$(function(){

		//evalData();
	});

	$('.closes').click(function () {
		$('.mask').css('display','none')
	})
	$('.file-box').click(function () {
		//jsonArray = []

	})
	//上传文件
    function uploadTFCFile(){
        var crowd_file = $('#myTFCfile')[0].files[0];
        var formData = new FormData();
        formData.append("file",$('#myTFCfile')[0].files[0]);
        formData.append("userId",result.stuorteaId);
        $.ajax({
            url:'doc-check/upload',
            dataType:'json',
            type:'POST',
            async: false,
            data: formData,
            processData : false, // 使数据不做处理
            contentType : false, // 不要设置Content-Type请求头
            success: function(data){
                if (data.code == 200) {
                    alert('上传成功！');
					jsonArray = []
					evalData();

					$('.prompt').html('<span class="looking">查看</span>')

                }
            },
            error:function(response){
                console.log(response);
            }
        });
    }

    //查询重复率
    function searchTFC(){
        console.log($('#myTFCfile')[0].files[0]);
        let tfcVal = $("#selectTFCClass").val();
        if($('#myTFCfile')[0].files[0] == undefined){
            alert("请上传文件");
            return;
        }else if(tfcVal == 1){
			alert("请选择重复率");
			return;
		}
        $.ajax({
            url:'doc-check?userId='+ result.stuorteaId +'&similarity=' + tfcVal,
            type:'get',
            success: function(data){
                console.log(data);
                if (data.code == 200) {
                    data = data.data;
                    alert("查询成功");
                    setTFCList(data);
                }

            },
            error:function(response){
                console.log(response);
            }
        });
	}
	//查重列表
	function setTFCList(data){
		$("#tfcTable tbody").empty();
		if(data.length == 0){
            $(".tfc-nodata").show();
            return;
		}
        $(".tfc-nodata").hide();
		$.each(data,function(i,d){
            let tr = $("<tr></tr>");
            let td1 = $("<td></td>").html(i+1);
            let td2 = $("<td></td>").html(d.file);
            let td3 = $("<td></td>").html(d.comparedFile);
            let td4 = $("<td></td>").html(d.similarity);
            tr.append(td1,td2,td3,td4);
            $("#tfcTable tbody").append(tr);
		});
	}
	//文件查看
	// 处理data树
	function evalData(){
		// var data = '[{"label":"一级1","children":[{"label":"二级1-1","children":[{"label":"三级1-1-1"}]}]},{"label":"一级2","children":[{"label":"二级2-1","children":[{"label":"三级2-1-1"},{"label":"三级2-1-2"}]},{"label":"二级2-2","children":[{"label":"三级2-2-1"},{"label":"三级2-2-2"}]}]}]';
		//var data =[{value: null, label: "000001-实验报告 (2).zip", children:[{"label":"三级1-1-1"}]}]
		// processJson(data,"#");


		$.ajax({
			url: 'doc-check/view?userId='+result.stuorteaId,
			type: 'GET',
			async: true,
			success: function(data) {
				ss = data.data
				processJson(data.data,"#");
			},
			error: function(data) {
				var json = JSON.stringify({
					"pageName": "error"
				});
				window.location.href = "skipPage?jsonStr=" + json;

			}
		});
	}

	// 解析层级数
	function processJson(data,pid){

		var datas = eval(data);
		if(datas){
			for(var i = 0 ; i < datas.length ; i++){
				var obj = {};
				var da = datas[i];
				obj.parent = pid;
				var id = guid();
				obj.id = id;
				obj.text = da.label;
				if(da.children != '' && da.children != null && da.children.length > 0){
					processJson(da.children,id);
				}
				jsonArray.push(obj);
			}
		}

	}
	//查看
	$('body').on('click','.looking',function(){
		//evalData()
		$('#jstree').data('jstree', false).empty();
		//$('#jstree').jstree(true).refresh(); //刷新树
		$('.mask').css('display','block')


		$("#jstree").jstree({
			"core": {
				'data': jsonArray
			}
		});
		console.log(jsonArray,77)
		// 展开节点
		$("#jstree").on("loaded.jstree", function (event, data) {
			// 展开所有节点
			$('#jstree').jstree('open_all');
		});

		// 所有节点都加载完后
		$("#jstree").on("ready.jstree", function (event, data) {
			//alert('all ok');
			$('#jstree').jstree('open_all');
		});

		// 获得点击节点的id
		$('#jstree').on("changed.jstree", function (e, data) {
			console.log('node.id is:' + data.node.id);
			console.log('node.text is:'+data.node.text);
		});



	})

	//用于生成uuid
	function S4() {
		return (((1+Math.random())*0x10000)|0).toString(16).substring(1);
	}
	function guid() {
		return (S4()+S4()+"-"+S4()+"-"+S4()+"-"+S4()+"-"+S4()+S4()+S4());
	}
</script>
</body>

</html>